<template>
  <MkDialogEdit ref="dialogRef" @submit="submit">
    <MkForm :model="r.model" ref="mkFormRef">
      <MkInput label="分组" v-model="r.model.category" :isEdit="false" />
      <MkInput label="标题" v-model="r.model.title" prop='title' required />
      <MkInput label="备注" v-model="r.model.remark" prop='remark' />
    </MkForm>
  </MkDialogEdit>
</template>

<script lang="ts" setup>
// 问卷分类新增，编辑
import { reactive, ref } from 'vue';
// 接口
import { BasPrintDraftApi, BasPrintDraftInput } from '/@/api/bas/BasPrintDraft';
// 工具
import { isNull, clog, showSuccess } from '/@/utils/index'

const emits = defineEmits(['onSuccess']);

const mkFormRef = ref();
const dialogRef = ref();

const r = reactive({
  model: {} as BasPrintDraftInput,
});

// 打开弹窗
const open = async (row: any) => {
  dialogRef.value.show();
  mkFormRef.value?.resetFields();
  r.model = { category: "维护", sql1: "Select 1" } as BasPrintDraftInput;
  r.model.template = `修改前
<table border="1px">
  <thead>
    <tr>
      <th v-for="(value, key) in t1[0]" :key="key">{{ key }}</th>
    </tr>
  </thead>
  <tbody>
    <tr v-for="(user, index) in t1" :key="index">
      <td v-for="(value, key) in user" :key="key">{{ value }}</td>
    </tr>
  </tbody>
</table>

修改后
<table border="1px">
  <thead>
    <tr>
      <th v-for="(value, key) in t2[0]" :key="key">{{ key }}</th>
    </tr>
  </thead>
  <tbody>
    <tr v-for="(user, index) in t2" :key="index">
      <td v-for="(value, key) in user" :key="key">{{ value }}</td>
    </tr>
  </tbody>
</table>   
`;
};

const submit = async () => {
  if (! await mkFormRef.value?.validate()) { return; }  // 表单校验失败 
  await BasPrintDraftApi.add(r.model)
  emits("onSuccess")
  dialogRef.value.close();
}

// 导出对象
defineExpose({ open });
</script>
